<!DOCTYPE html>
<!-- saved from url=(0052)http://getbootstrap.com/docs/4.0/examples/dashboard/ -->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!--    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">-->
    <meta name="description" content="">
    <meta name="author" content="">

    <title>UAV监测系统</title>
    <!-- Bootstrap core CSS -->
    <link th:href="@{/css/bootstrap.min.css}" rel="stylesheet">
    <!-- Custom styles for this template -->
    <link th:href="@{/css/dashboard.css}" rel="stylesheet">
    <!--    <script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>-->
    <!--    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>-->

    <style type="text/css">
        /* Chart.js */
        /*导航栏居中*/


        /*文字居中*/
        th,td{
            text-align: center;
        }
        /*添加表格边框*/
        .f1{
            border: 1px solid #dee2e6;
        }
        .f2{
            border: 1px solid #dee2e6;
        }
        .f3{
            border: 1px solid #dee2e6;
        }

        /*导航栏居中*/
        .my-form {
            flex-flow: inherit;
        }
        .table td {
            vertical-align: inherit;
        }

        /*.liActive {*/
        /*    background-color: red !important;*/
        /*}*/


        /*分页放中间*/
        .pagination {
            padding-left: 50%;
            margin-left: -200px;
            width: 200px;
        }

        @-webkit-keyframes chartjs-render-animation {
            from {
                opacity: 0.99
            }
            to {
                opacity: 1
            }
        }

        @keyframes chartjs-render-animation {
            from {
                opacity: 0.99
            }
            to {
                opacity: 1
            }
        }

        .chartjs-render-monitor {
            -webkit-animation: chartjs-render-animation 0.001s;
            animation: chartjs-render-animation 0.001s;
        }

    </style>
</head>

<body>
<div class="box">
    <nav class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0">
        <div style="display: flex;width: 300px">

            <a class="navbar-brand col-sm-3 col-md-2 mr-0" th:href="@{/uav/user/index}" style="padding-right: 241px;">
                UAV无人机检测路段
            </a>
            <!--			<input class="col-sm-3 mr-0 form-control form-control-dark w-100" type="text" placeholder="Search" aria-label="Search">-->
            <!--			<button type="button" class="btn btn-dark">查询</button>-->
            <!--			<form class="form-control" action="/hello">-->
            <!--			<input class="form-control form-control-dark w-25" type="text" placeholder="Search">-->
            <!--			<button type="submit" class="btn btn-dark">查询</button>-->
            <form class="form-inline my-form" th:action="@{/uav/user/index}">
                <input name="roadCrossing" class="form-control form-control-dark  " type="search" placeholder="Search"
                       aria-label="Search" style="width: 500px !important">
                <button class="btn btn-outline-success my-2 my-sm-0" type="submit" style="margin-left: 10px">Search</button>
            </form>
            <!--			</form>-->
        </div>

        <ul class="navbar-nav px-3">
            <li class="nav-item text-nowrap">
                <a class="nav-link" th:href="@{/uav/logout}">Sign out</a>
            </li>
        </ul>
    </nav>

    <!--		退出标签-->
    <div class="container-fluid">
        <div class="row">
            <nav class="col-md-2 d-none d-md-block bg-light sidebar">
                <div class="sidebar-sticky">
                    <ul class="nav flex-column">

                        <li class="nav-item" style="margin-top: 5px;margin-left: 20px">
                            <a class="nav-link" th:href="@{/uav/user/index?id=0}">
                                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"
                                     fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
                                     stroke-linejoin="round" class="feather feather-home">
                                    <path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path>
                                    <polyline points="9 22 9 12 15 12 15 22"></polyline>
                                </svg>
                                路段信息 <span class="sr-only">(current)</span>
                            </a>
                        </li>
                        <li class="nav-item" style="margin-top: 10px;margin-left: 20px">
                            <a class="nav-link" th:href="@{/uav/user/manger?id=1}">
                                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-person-lines-fill" viewBox="0 0 16 16">
                                    <path d="M6 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-5 6s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H1zM11 3.5a.5.5 0 0 1 .5-.5h4a.5.5 0 0 1 0 1h-4a.5.5 0 0 1-.5-.5zm.5 2.5a.5.5 0 0 0 0 1h4a.5.5 0 0 0 0-1h-4zm2 3a.5.5 0 0 0 0 1h2a.5.5 0 0 0 0-1h-2zm0 3a.5.5 0 0 0 0 1h2a.5.5 0 0 0 0-1h-2z"/>
                                </svg>
                                &nbsp;用户管理
                                <span class="sr-only">(current)</span>
                            </a>
                        </li>
                        <li class="nav-item" style="margin-top: 10px;margin-left: 20px">
                            <a class="nav-link" th:href="@{/uav/user/system?id=2}">
                                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-signpost-2" viewBox="0 0 16 16">
                                    <path d="M7 1.414V2H2a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h5v1H2.5a1 1 0 0 0-.8.4L.725 8.7a.5.5 0 0 0 0 .6l.975 1.3a1 1 0 0 0 .8.4H7v5h2v-5h5a1 1 0 0 0 1-1V8a1 1 0 0 0-1-1H9V6h4.5a1 1 0 0 0 .8-.4l.975-1.3a.5.5 0 0 0 0-.6L14.3 2.4a1 1 0 0 0-.8-.4H9v-.586a1 1 0 0 0-2 0zM13.5 3l.75 1-.75 1H2V3h11.5zm.5 5v2H2.5l-.75-1 .75-1H14z"/>
                                </svg>
                                &nbsp;道路管理
                                <span class="sr-only">(current)</span>
                            </a>
                        </li>

                    </ul>
                </div>
            </nav>
            <!--				Share  Export  This week-->
            <main role="main" class="col-md-9 ml-sm-auto col-lg-10 pt-3 px-4">
                <div>
                <img th:src="@{/img/noauth.jpg}" height="600px">
                </div>

            </main>
            <!--		<a href="#"  onclick="handlePage(123)" >hhhhh </a>-->
        </div>
    </div>
</div>

<script type="text/javascript" charset="UTF-8" defer="defer">

    //点亮左侧导航栏
    var n=document.getElementsByClassName("nav-link");
    var index=1;
    console.log(index)
    document.getElementsByClassName("nav-link")[index].className="nav-link active";
    console.log(document.getElementsByClassName("nav-link")[index].className);

</script>
<script type="text/javascript" th:src="@{/js/jquery-3.2.1.slim.min.js}" ></script>
<script type="text/javascript" th:src="@{/js/popper.min.js}" ></script>
<script type="text/javascript" th:src="@{/js/bootstrap.min.js}" ></script>

</body>

</html>
